body {
      font-family: Georgia;
      font-size: 18px;
      line-height: 1.6;
      color: #000;
      background-color: #D9D9D9;
    }

    header {
      background-color: #a1b9e1;
      color: #fff;
      text-align: center;
      padding: 20px 0;
    }

    header h1 {
      margin: 0;
      font-family: Chalkboard SE; /* Use a fancy cursive font */
      font-size: 36px; /* Adjust font size as needed */ 
    }

    header p {
      margin: 5px 0 0;
    }

    .tabs {
      margin-top: 20px;
      padding-top: 10px; /* Add padding to the top */
      overflow: auto; /* Enable horizontal scrolling on smaller screens */
    }

    .tabs ul {
      list-style-type: none;
      padding: 0;
      margin: 0;
      display: flex;
      justify-content: center;
      flex-wrap: wrap; /* Allow tabs to wrap to the next line */
    }

    .tabs li {
      margin-right: 10px;
      margin-bottom: 10px; /* Add space between tabs */
    }

    .tabs a {
      text-decoration: none;
      padding: 10px 15px;
      border-radius: 5px;
      color: #fff;
      background-color: #a1b9e1;
    }

    .tabs a:hover {
      background-color: #a1b9e1;
    }

    .content-section {
      background-color: #fff;
      padding: 20px;
      margin: 20px 0;
      border-radius: 5px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }

    .video-container {
      display: flex;
      justify-content: center; /* Center-align the items */
      gap: 20px;
      flex-wrap: wrap;
    }

    .video-item {
      width: 100%;
      max-width: 400px;
      margin-bottom: 20px;
      box-sizing: border-box; /* Include padding and border in the width calculation */
    }

    .video-item p {
      margin-bottom: 20px;
    }

    .video-item video {
      width: 100%;
      height: auto;
      border: 1px solid #ddd;
      border-radius: 10px;
    }
    .video-item strong {
      font-family: Chalkboard SE; /* Replace 'Your Desired Font' with the actual font name */
      font-size: 22px; /* Adjust the font size as needed */
      font-weight: bold;
      color: #333; /* Adjust the color as needed */
    }

    h2 {
      color: #a1b9e1;
      margin-left: 75px;
      font-family: Chalkboard SE; /* Use a fancy cursive font */
    }

    h3 {
      color: #a1b9e1;
      margin-left: 13px;
      font-size: 25px;
      font-family: Chalkboard SE;
    }

    h4 {
      color: #a1b9e1;
      font-family: Chalkboard SE;
      font-size: 25px;
    }

    h5 {
      color: #333;
      margin-left: 13px;
      font-size: 25px;
      font-family: Chalkboard SE;
    }

    h6 {
      color: #a1b9e1;
      font-family: "Chalkboard SE", sans-serif;
      font-size: 25px;
      margin-left: 10px; /* Optional: Adjust as needed to move away from the left edge */
      text-align: left;
    }


    
    .image-gallery img {
        max-width: 100%;
        max-height: 300px; /* Set a maximum height */
        height: auto;
        display: block;
        margin: 0 auto;
        border-radius: 8px; /* Optional: Add rounded corners for a stylish look */
    } 

    .image-gallery {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: 20px;
    }

    .powerpoints {
      margin-bottom: 20px;
    }

    .navigation {
      margin-top: 20px; /* Adjust the margin as needed */
    }
  
    #videos h2 {
      margin-left: 70px; /* Adjust the value as needed */
    }

    #about-me-description {
      order: 2;
      max-width: 400px;
    }

    #about-me-content {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
    }

    #about-me-text {
      flex: 50;
      max-width: 5000px; /* Adjust the width as needed */
      margin-left: 75px;
      margin-right: 0px;
      margin-top: 1px;

    }

    #about-me-image img {
      width: 500px;
      max-width: 200px;
      margin-left: 60px;
      margin-right: 60px;
      height: auto;
      border-radius: 5px;
    }

    .contact-bar {
      background-color: #b4c7e7;
      color: #fff;
      text-align: center;
      padding: 10px;
      position: fixed;
      bottom: 0;
      width: 97.5%;
      max-width: 2000px;
      z-index: 1;

    }
    .content-section {
      margin-bottom: 60px; /* Adjust the margin to create space for the contact bar */
    }

    #resume {
      display: block;
    }

    .content-list {
      list-style: none;
      padding: 0;
    }

    .content-list li {
      margin-bottom: 50px; /* Adjust the margin as needed */
    }

    .content-list h4 {
      margin-bottom: 8px; /* Adjust the margin as needed */
    }

    .work-experience {
      border: 5px solid #7a9cd4; /* Border color */
      border-radius: 10px; /* Border radius for rounded corners */
      padding: 10px; /* Add padding inside the border for spacing */
      padding-top: 5px;
      margin-bottom: 5px; /* Add margin at the bottom to separate each work experience */
    }

    .work-experience h3 {
      color: #7a9cd4; /* Text color for the work experience title */
      margin-bottom: 1px; /* Reduce space between company title and job title */
      font-family: Garamond, sans-serif; /* Apply Garamond font */

    }

    .work-experience p {
      margin: 1px 0; /* Adjust the paragraph margin for better spacing */
    }

    .work-experience ul {
      /* Add styles for the bullet points */
      list-style-type: disc; /* Use bullets */
      margin-left: 20px; /* Adjust margin for better alignment */
    }

    .work-experience li {
      /* Additional styles for work experience list items */
      margin-bottom: 2px; /* Add margin bottom for white space between job entries */
    }

    #skills {
  /* Your styles for the #skills section */
    }

    .skills-list {
      list-style: none;
      padding: 0;
      margin-right: 60px;
    }

    .skill {
      background-color: #a1b9e1;
      margin: 0 -70px 10px 0;
      margin-left: 75px;
      padding: 10px 15px;
      border-radius: 5px;
      color: #fff;
      display: inline-block; /* Set display to inline-block */
    }


    .slider {
        position: relative;
        width: 80%;
        margin: 20px auto;
        overflow: hidden;
        background-color: transparent;
        text-align: center;
       
    }

    .slider2 {
      position: relative;
      width: 80%;
      margin: 20px auto;
      overflow: hidden;
      background-color: transparent;
      text-align: center;
     
  }

    .slides {
        display: flex;
        transition: transform 0.5s ease-in-out;
       height: auto;
    }

    .slide {
        min-width: 100%;
        
        box-sizing: border-box;
        padding: 20px;
        background-color: #f4f4f4;
        border: 1px solid #ccc;
        display: flex;
        justify-content: center;
    }

    
    button {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background-color: rgba(0, 0, 0, 0.5);
        color: #fff;
        border: none;
        padding: 10px;
        cursor: pointer;
    }

    button.prev {
        left: 10px;
    }

    button.next {
        right: 10px;
    }

    a {
        color: blue;
        text-decoration: underline;
        cursor: pointer;
    }

a:hover {
    color: darkblue;
}